<style>
    * {
        margin: 0;
        padding: 0;
    }
    h2,h3,h4{
        font-weight: normal;
        margin: 0;
    }
    li {
        list-style: none;
    }
    .content-box{
        margin:5px 20px;
        background: #f8f8f8;
        overflow: hidden;
    }
    .right-content{
        padding:20px 0px 70px 37%;
        border-left:4px solid #fff;;
    }
    h2{
        text-align: right;
        font-size:16px;
        padding-right:20px;
        line-height:36px;
    }
    h3{
        font-size:14px;

    }
    .main-right-list li,.second-content-list li,.product-belong-list li{
        padding:10px 0;
    }


    .classify-table tr td{
        border:1px solid #cbcbcb;
        padding:5px 0;
    }
    .classify-table tr td input[type=text]{
        width:80px;
        border-radius:2px;
        border:1px solid #cbcbcb;
    }
    .classify-table tr td input[type=button]{
        padding:1px 5px;
        color:#286e9f;
        background:#fff;
        border:1px solid #cbcbcb;
        margin-left:10px;
        border-radius:3px;
    }
    .main-right-list li span{
        display: inline-block;
        width: 100px;
    }
    .main-right-list li input[type=text]{
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border:1px solid #cccccc;
        width: 30%;
        height: 34px;
        padding-left: 12px;
    }
    .main-right-list li select{
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border:1px solid #cccccc;
        width: 30%;
        height: 34px;
        padding-left: 12px;
        margin-left: -5px;
    }
    .main-right-list li form textarea{
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        border:1px solid #cccccc;
        padding-left: 12px;
        padding-right: 2px;
        margin-left: 100px;
    }
    .option {
        display:block;
        margin-left: 100px;
        width: 100%;
    }
    label input{
        width: 5%;
        height: 15px;
        font-weight: 500;
    }
    input[type=file] {
         display:inline;
    }
</style>
<section class="content-header">
    <h1 style="display:inline-block;">题库管理</h1>&nbsp&nbsp<h4 style="display:inline-block;color: #707070">新增题目</h4>
</section>
<section class="content">
    <div class="AC_content">
        <div class="main-infor content-box">
            <div class="content">
                <ul class="main-right-list">
                    <form action="<%=uploadPath%>" enctype="multipart/form-data" method="post">
                        <span>题库上传：</span><input type="file" name="file"/><input type="submit" value="上传"></li>
                    </form>
                    <hr/>
                    <li><span>课程名称：</span>
                        <select name="select" id="course_name">
                            <option>请选择课程</option>
                            <%for(var i=0;i<data.length;i++){%>
                            <option data-id="<%=data[i].course_id%>"><%=data[i].course_name%></option>
                            <%}%>
                        </select>
                    </li>
                    <li><span>题目类型：</span>
                        <select name="select" id="category">
                            <option>请选择分类</option>
                            <option data-id="0">判断题</option>
                            <option data-id="1">单选题</option>
                            <option data-id="2">多选题</option>
                        </select>
                    </li>
                    <li><span>题目详情：</span>
                        <form>
                            <textarea name="content" id="content" style="width:300px;height:120px;" ></textarea>
                        </form>
                    </li>
                    <li><span>题目选项：</span>
                        <form id="myForm" method="get" action="./" />
                            <label class="option"><input type="text" name="txt" id="txt0" /><input type="checkbox" name="box" id="0"/></label>

                            <p style="margin-left: 460px;">
                                <input type="button" value="添加选项" onClick="addTextBox(this.form,this.parentNode)" />
                                <input type="button" value="移除选项" onClick="removeTextBox(this.form)" /><p style="padding-left: 450px">(请在正确选项后面打钩)</p>
                            </p>
                        </form>
                    </li>
                </ul>
            </div>
        </div>
        <input type="button" value="保&nbsp;&nbsp;存" class="publish btn btn-lg btn-primary" style="margin:50px 50% 0;">
    </div>
</section>
<%if(msg){%>
<script>
var msg='<%=msg%>'
    alert(msg);
</script>
<%}%>
<script type="text/javascript">
    var textNumber = 0;
    function addTextBox(form, afterElement) {
        // Increment the textbox number
        textNumber++;
        // Create the label
        var label = document.createElement("label");
        label.setAttribute("class","option");
        // Create the textbox
        var textField = document.createElement("input");
        textField.setAttribute("type","text");
        textField.setAttribute("name","txt");
        textField.setAttribute("id","txt"+textNumber);
        var checkbox = document.createElement("input");
        checkbox.setAttribute("type","checkbox");
        checkbox.setAttribute("name","box");
        checkbox.setAttribute("id",textNumber);
        // Put the textbox inside
        label.appendChild(textField);
        label.appendChild(checkbox);
        // Add it all to the form
        form.insertBefore(label,afterElement);
        return false;
    }
    function removeTextBox(form) {
        if (textNumber > 0) { // If there's more than one text box
            // Remove the last one added
            form.removeChild(document.getElementById("txt"+textNumber).parentNode);
            textNumber--;
        }
    }
</script>
